<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <!-- 
        pop()删除数组的最后一个元素并返回删除元素
        注意:此方法会改变数组的长度
     -->
    <!-- w3cs实例 -->
    <p id="demo">单击按钮删除数组的最后一个元素</p>
    <button onclick="myFunction()">点击</button>
    <script>
        var popArray = [0, 1, 2, 3, 4, 5, 6];

        function myFunction() {
            popArray.pop();
            var x = document.getElementById("demo");
            x.innerHTML = popArray;
            console.log("数组长度" + popArray.length)
        }
    </script>

    <!-- 
        shift()删除数组的第一个元素并返回删除元素
        注意:此方法会改变数组的长度
     -->
    <!-- w3c实例 -->
    <p id="demo1">单击按钮删除第一个元素</p>
    <button type="button" onclick="myFunction1()">点击</button>
    <script>
        var shiftArray = [6, 5, 4, 3, 2, 1, 0];

        function myFunction1() {
            shiftArray.shift();
            var x = document.getElementById("demo1");
            x.innerHTML = shiftArray;
            console.log("数组长度:" + shiftArray.length);
        }
    </script>

</body>

</html>